<template>
  <el-drawer
    :visible.sync="drawer"
    direction="btt"
    size="90%"
    title="捷联运平台须知【承运商】">
    <div>
      <div class="content">
        欢迎您注册捷联运账号并使用捷联运平台运力交易服务!
        捷联运平台是通过整合平台所有货主的物流运输需求,为所有货主提供优质的物流运输
        方案,以及快速完成货的所需的运力交易的专业平台,为快速有效准确的让您完成注册和使
        用本平台的服务,您应当认真阅读本捷联运平台注册须知,避免您注册后仍不能使用本平台
        的相关服务,导致您的利益受损。
        1.注册本平台账号前,您应知晓本平台是集运力需求发布、运力交易需求组合、运力需
        求交易、物流运输合同签订、物流状态跟踪、物流账单自动生成、物流费用结算支付等功能
        为一体的综合类线上运营平台。
        2.本平台所提供功能服务须您拥有电子签章、开通平台钱包、认可平台提供的物流运输
        合同模版条款后才能完全享受平台提供的全部服务。
        3.注册本平台账号后,本平台就您与您账号的使用人/操作人之间的关系不具有任何核查
        义务,您应自行妥善保管账号,任何使用您的账号登录使用本平台服务的行为均视同您的行
      </div>

      <div class="btn-list">
        <el-button class="cancel" round @click="handleCancel">更换角色</el-button>
        <el-button class="success" round @click="handleSuccess">同意须知</el-button>
      </div>
    </div>
  </el-drawer>
</template>

<script>
export default {
  emits: ["handleStep1"],
  data () {
    return {
      drawer: false,
    }
  },
  methods: {
    open () {
      this.drawer = true;
    },
    handleCancel () {
      this.drawer = false;
      this.$emit("handleStep1", false);
    },
    handleSuccess () {
      this.drawer = false;
      this.$emit("handleStep1", true);
    },
  }
}
</script>


<style lang="scss" scoped>
/deep/ .el-drawer {
  border-radius: 25px 25px 0 0;
}

/deep/ .el-drawer__header {
  background-color: #fff;
  font-size: 20px;
  font-weight: bold;
  text-align: center;
  color: #333;
}

.content {
  padding: 0 20px;
  line-height: 1.5;
  overflow: auto;

}
.btn-list{
  margin-top: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  /deep/.el-button.cancel {
    padding: 12px 36px;
    background-color: #fff;
    color: #000;
    font-weight: bold;
    box-shadow: 2px 2px 2px #fff0f1;
  }
  /deep/.el-button.success {
    padding: 12px 36px;
    color: #fff;
    background-color: #ee131b;
  }
}
</style>